<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

    <div class="placeholder"></div>
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <span class="efficientlogo"><img src="./img/task8-1-5.png" alt="高效"></span>
                <h3 class="explain font-20-d">高效</h3>
                <p class="word font-16">将五到七年的成长时间，缩短到一年到三年。</p>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <span class="standardlogo"><img src="./img/task8-1-6.png" alt="规范"></span>
                <h3 class="explain font-20-d">规范</h3>
                <p class="word font-16">标准的实战教程，不会走弯路</p>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <span class="contactslogo"><img src="./img/task8-1-7.png" alt="人脉"></span>
                <h3 class="explain font-20-d">人脉</h3>
                <p class="word font-16">同班好友，同院学长，技术大师，入学就混入职脉圈，为以后铺平道路。</p>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="numberbox">
                        <span class="number font-14"><img class="numberlogo" src="./img/task8-1-8.png"
                                                          alt="">&nbsp12400</span>
                    <p class="word font-16">累计在线学习人数</p>
                    <span class="number font-14"><img class="numberlogo" src="./img/task8-1-8.png"
                                                      alt="">&nbsp12400</span>
                    <p class="word font-16">学员已经找到满意工作</p>
                </div>
            </div>
        </div>
        <div class="placeholder"></div>
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <h4 class="study font-20-d">如何学习</h4>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">1</span>
                    <div class="stepbox">
                        <p class="step font-12-d">匹配你现在的个人情况寻找合适自己的岗位</p>
                    </div>
                    <span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px" height="22px" alt="箭头">
                        </span>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">2</span>
                    <div class="stepbox">
                        <p class="step font-12-d">了解职业前景薪金待遇，竞争压力等</p>
                    </div>
                    <div class="stepbox"><span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px"
                                                                      height="22px" alt="箭头"></span></div>

                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">3</span>
                    <div class="stepbox">
                        <p class="step font-12-d">掌握行业内顶级技能</p>
                    </div>
                    <span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px" height="22px" alt="箭头">
                        </span>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">4</span>
                    <div class="stepbox">
                        <p class="step font-12-d">查看职业目标任务</p>
                    </div>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">5</span>
                    <div class="stepbox">
                        <p class="step font-12-d">参考学习资源，掌握技能点，逐个完成任务</p>
                    </div>
                    <span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px" height="22px" alt="箭头">
                        </span>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">6</span>
                    <div class="stepbox">
                        <p class="step font-12-d">加入班级，和小伙伴们互帮互助，一块学习</p>
                    </div>
                    <span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px" height="22px" alt="箭头">
                        </span>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">7</span>
                    <div class="stepbox">
                        <p class="step font-12-d">匹配你现在的个人情况寻找合适自己的岗位</p>
                    </div>
                    <span class="arrowlogo"><img src="./img/task8-1-9.png" width="24px" height="22px" alt="箭头">
                        </span>
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                <div class="containerbox">
                    <span class="circularbox">8</span>
                    <div class="stepbox">
                        <p class="step font-12-d">完成职业技能，升级业界大牛</p>
                    </div>
                </div>
            </div>
            <div class="placeholder"></div>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <h4 class="study font-20-d">优秀学员展示</h4>
            </div>

            <c:forEach items="${tbStudent}" var="student">
                <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
                    <div class="studentbox">
                        <span class="photo"><img class="tutor" src="${student.img}">
                        </span>
                        <h4 class="name font-20-d">${student.name}</h4>
                        <p class="introduce font-16-d">${student.profession}：${student.introduction}</p>
                    </div>
                </div>
            </c:forEach>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="botbox">
                    <input type="radio" id="i1" name="bot" checked></input>
                    <input type="radio" id="i2" name="bot"></input>
                    <input type="radio" id="i3" name="bot"></input>
                    <input type="radio" id="i4" name="bot"></input>
                    <label for="i1"></label>
                    <label for="i2"></label>
                    <label for="i3"></label>
                    <label for="i4"></label>
                    <div class="placeholder"></div>
                </div>
            </div>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <h4 class="study font-20-d">战略合作企业</h4>
            </div>
        </div>
        <div class="bg-white">
            <div class="row-1-10">
                <div class="col-xs-10-10 col-sm-10-10 col-md-2-10 col-lg-2-10">
                    <img class="enterpriselogo" src="./img/task8-1-14.png" alt="阿里巴巴">
                </div>
                <div class="col-xs-10-10 col-sm-10-10 col-md-2-10 col-lg-2-10">
                    <img class="enterpriselogo" src="./img/task8-1-15.png" alt="金山云">
                </div>
                <div class="col-xs-10-10 col-sm-10-10 col-md-2-10 col-lg-2-10">
                    <img class="enterpriselogo" src="./img/task8-1-16.png" alt="环信">
                </div>
                <div class="col-xs-10-10 col-sm-10-10 col-md-2-10 col-lg-2-10">
                    <img class="enterpriselogo" src="./img/task8-1-17.png" alt="容联">
                </div>
                <div class="col-xs-10-10 col-sm-10-10 col-md-2-10 col-lg-2-10 ">
                    <img class="enterpriselogo" src="./img/task8-1-18.png" alt="七牛">
                </div>
            </div>
        </div>
        <div class="placeholder"></div>
        <div class="bg-white">
            <h4 class="study font-20-d">友情链接</h4>
            <div class="row-1-30">
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3-30 col-md-3-30 col-sm-6-30 col-xs-10-30">
                    <div class="link-area">
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                        <div class="link-set">
                            <a class="font-16 link-a" href="#">
                                <div class="spot"></div>手机软件
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
